<template>
  <div class="mui-numbox" data-numbox-step='1' data-numbox-min="1" :data-numbox-max="inventory" style="height:25px">
    <button class="mui-btn mui-btn-numbox-minus" type="button" disabled=''>-</button>
    <input id="test" class="mui-input-numbox" type="number" :value="count"  @change="getcount" ref='numbox' readonly>
    <button class="mui-btn mui-btn-numbox-plus" type="button">+</button>
  </div>

</template>

<script>
import mui from "../../lib/mui/js/mui.min.js";
export default {
  data() {
    return {
    };
  },
  methods: {
    getcount(){
      // 方法1
      //   var arr = [];   // 定义一个新数组，用来存储处理后的数据
      //   JSON.parse(localStorage.getItem('car')).forEach(item=>{
      //     if(item.id == this.currentId) {
      //       item.count = this.$refs.numbox.value;
      //       // localStorage.setItem('car',JSON.stringify(item))
      //     }
      //     arr.push(item);
      //   })
      //   console.log(arr)
      //   localStorage.setItem('car',JSON.stringify(arr));
      // }
      this.$store.commit('updatedGoodsInfo',{
        id: this.currentId,
        count: this.$refs.numbox.value
      })
    }
  },
  // 钩子函数放到了methods里 导致异常！！！
  mounted() {
    // 初始化 数组选择框组件
    mui('.mui-numbox').numbox()
  },
  props:['count','inventory','currentId']
};
</script>

<style lang='less' scoped>
</style>
